<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>BBS</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <link rel="stylesheet" type="text/css" href="/css/bootstrap.min.css"/>
    <!-- 引入fontawesome字体图标 -->
    <link rel="stylesheet" type="text/css" href="/fontawesome/css/all.css"/>
    <!-- 自定义样式 -->
    <link rel="stylesheet" type="text/css" href="/css/bbs.css"/>
    <script type="application/javascript" src="/js/jquery-3.4.1.min.js"></script>
    <script type="application/javascript" src="/js/bootstrap.bundle.min.js"/>
    <script type="application/javascript" src="/js/bootstrap.min.js"></script>

</head>
<script type="application/javascript">
    window.onload = function () {
        var closable = window.localStorage.getItem("closable");
        if (closable) {
            window.close();
            window.localStorage.removeItem("closable");
        }
    }
</script>
<body>
<!-- 引入顶部工具栏 -->
<div th:replace="/top::topBar"></div>
<div class="container main" style="background-color: white">
    <div class="row">
        <div class="col-lg-9 col-md-9 col-sm-9 col-xs-12">
            <h2><span class="fas fa-list" aria-hidden="true"></span>&nbsp;发现</h2>
            <hr>

            <div class="media" th:each="question : ${paginationDTO.list}">
                <img th:src="${question.user.avatarUrl}" class="mr-3 rounded littleImg"
                     alt="...">
                <div class="media-body">
                    <h5 class="mt-0"><a th:href="@{'/profile/questions/'+${question.id}}" th:text="${question.title}"></a></h5>
                    <span th:text="${question.description}"></span><br>
                    <span class="questionDetail">
                        • <span th:text="${question.commentCount}"></span>个评论
                        • <span th:text="${question.viewCount}"></span>次浏览
                        • <span th:text="${#dates.format(question.gmtCreate,'yyyy-MM-dd HH:mm')}"></span>
                    </span>
                </div>
            </div>
            <nav aria-label="Page navigation example" style="float: right">
                <ul class="pagination">
                    <li class="page-item" th:class="${paginationDTO.pageNum == 1 ? 'page-item disabled ':'page-item'}">
                        <a class="page-link" href="#" aria-label="Previous" th:href="@{/(currentPage=${paginationDTO.pageNum - 1})}">
                            <span aria-hidden="true">&laquo;</span>
                        </a>
                    </li>
                    <li class="page-item" th:each="i: ${#numbers.sequence(1, paginationDTO.pages)}"
                        th:class="${i == paginationDTO.pageNum ? 'page-item active':'page-item'}">
                        <a class="page-link" th:text="${i}" th:href="@{/(currentPage=${i})}"></a>
                    </li>
                    <li class="page-item" th:class="${paginationDTO.pageNum == paginationDTO.pages ? 'page-item disabled ':'page-item'}">
                        <a class="page-link" href="#" aria-label="Next" th:href="@{/(currentPage=${paginationDTO.pageNum + 1})}">
                            <span aria-hidden="true">&raquo;</span>
                        </a>
                    </li>
                </ul>
            </nav>
        </div>
        <div class="col-lg-3 col-md-3 col-sm-3 col-xs-12">
            <h3>热门话题</h3>
        </div>
    </div>
</div>
</body>
</html>